<template>
	<view class="container_tab map_container">
		<view class="maphead">教育地图</view>
		<view class="maplist">
			<view class="mapitem" v-for="(item,index) in list" :key="index" @tap="openLocation(item)">
				<view class="mapitem-l">
					<img-item :src="item.coverUrl"></img-item>
				</view>
				<view class="mapitem-r">
					<view class="mapitem-p1">
						<text class="p1-text">{{item.name}}</text>
						<image v-if="index<3" class="mapitem-img" :src="'../../../static/image/tabBar/no'+(index+1)+'.png'"></image>
					</view>
					<view class="mapitem-p2">
						<text>简介：</text>
						<rich-text class="mapitem-introduction" :nodes="item.introduction"></rich-text>
					</view>
					<view class="mapitem-p3">开放时间：{{item.openTime}}</view>
					<view class="mapitem-p4">{{item.address}}</view>
					<view class="mapitem-p5">
						<view class="mapitem-button mapitem-location" @tap.native.stop="locationtap(item)" hover-class="current" >
							<text class="iconfont icon-location"></text>
							<text>导航</text>
						</view>
						<view class="mapitem-button mapitem-phone" @tap.native.stop="phonetap(item)" hover-class="current" >
							<text class="iconfont icon-phone"></text>
							<text>{{item.mobile}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {maplist,maphot,getmap} from "@/http/api";
	export default {
		data() {
			return {
				content:'',
				list:[],
				page:1,
				pagesize:10,
				pages:1,
				total:10
			}
		},
		methods:{
			getData(){
				this.getMaplist();
			},
			getMaplist(){
				this.$request({
					url: maplist,
					data: {
						'current':this.page,
						'size':this.pagesize
					}
				}).then(res => {
					this.list = this.list.concat(res.records);
					this.weekTimeToStr();
					this.pages = res.pages;
					this.total = res.total;
				})
			},
			weekTimeToStr(){
				this.list.map((item,index) => {
					if (item&&item.openTimeList) {
						let ot = item.openTimeList;
						let openTime = '';
						for(let i in ot){
							let week = this.intToWord(ot[i].week);
							let t = ot[i].startTime.slice(0,-3) + '-' + ot[i].endTime.slice(0,-3);
							openTime = openTime + week + t + ' ';
						}
						item.openTime = openTime;
					}
					return item;
				})
				// console.log(this.list);
			},
			locationtap(e){
				this.maphot(e,'location');
				uni.openLocation({
					longitude: Number(e.longitude),
					latitude: Number(e.latitude),
					name: e.name,
					address: e.address,
					success: function () {
						console.log('success');
					},
					fail: function (err) {
						console.log(err);
					}
				})
			},
			phonetap(e){
				this.maphot(e,'phone');
				uni.makePhoneCall({
				    phoneNumber: e.mobile
				});
			},
			maphot(e,type){
				this.$request({
					url: maphot,
					data: {
						'id':e.id,
						'type':type
					}
				}).then(res => {
					console.log(res);
				})
			},
			openLocation(e){
				this.goPage('/pages/map/detail',{id:e.id});
			},
			loadMore() {
				if(this.page<this.pages){
					this.page++;
					this.getMaplist()
				}
			},
			intToWord(week){
				let day;
				switch (week) {
				  case 7:
				    day = "周日";
				    break;
				  case 1:
				    day = "周一";
				    break;
				  case 2:
				    day = "周二";
				    break;
				  case 3:
				    day = "周三";
				    break;
				  case 4:
				    day = "周四";
				    break;
				  case 5:
				    day = "周五";
				    break;
				  case  6:
				    day = "周六";
				}
				return day;
			}
		}
	}
</script>

<style lang="scss">
	@import "./index.scss"
</style>
